<template>
<div>
    <h1>房号信息显示</h1>
    <br>
    <a href="/FAdd">新增</a>
    <br>
    <a href="https://localhost:7231/api/Fang/Dao">导出</a>
    房号名称
    <input type="text" v-model="pageps.fname">
    房号创建时间
    <input type="date" v-model="pageps.time">
    
    <input type="button" value="查询" @click="FShow">
    <input type="button" value="修改状态" @click="Upd">

    <table class="table">
        <thead>
            <tr>
                <td><input type="checkbox" v-model="quan" @change="qx"></td>
                <td>房号名称</td>
                <td>房号</td>
                <td>房号创建时间</td>
                <td>状态</td>
            </tr>
        </thead>

        <tbody>
            <tr v-for="d in data">
                <td><input type="checkbox" v-model="fan" :value="d.fid"></td>
                <td>{{d.fangName}}</td>
                <td>{{d.fHao}}</td>
                <td>{{moment(d.fangTime).format("yyyy年MM月DD日 hh时mm分ss秒")}}</td>
                <td>{{d.zt==1?'上架':'下架'}}</td>
            </tr>
        </tbody>
    </table>
</div>

</template>

<script setup lang="ts">
import {ref,onMounted} from 'vue';
import axios from 'axios';
import { useRouter } from 'vue-router';
import moment from 'moment';
const router=useRouter()

onMounted(()=>{
    FShow()
})

const data=ref([{
    "fid": 1,
    "fangName": "普通房",
    "fHao": "102",
    "fangTime": "2025-06-16T18:06:18.5367119",
    "zt": 1
}])


const quan=ref(false)
const fan=ref([])

const qx=()=>{
    if(quan.value){
        data.value.forEach(x=>{
            fan.value.push(x.fid)
        })
    }else{
        fan.value=[]
    }
}

const Upd=()=>{
    if(!confirm("确认修改吗")){
        return;
    }
    axios.get("/api/Fang/Updstate",{params:{idstring:fan.value.toString()}}).then(res=>{
        if(res.data>0){
            alert("修改成功");
            FShow()
        }else{
            alert("修改失败");
        }
    })
}



const pageps=ref({
    fname:'',
    time:''
})



const FShow=()=>{
    axios.get("/api/Fang/Show",{params:pageps.value}).then(res=>{
        data.value=res.data
    })
}


        
</script>

<style lang="scss" scoped>

</style>